/*公共样式*/
* {
	margin: 0;
	padding: 0;
	font-style: normal;
	box-sizing: border-box;
}
ul,ol {
	list-style: none;
}
img {
	display: block !important;
}
a {
	color: #000;
}
a,u {
	text-decoration: none;
}
/*字体样式*/
body {
	font-family: "微软雅黑";
    font-size: 12px;
    position: relative;
	overflow-x:hidden;
}
/*浮动*/
.fl {
	float: left;
}
.fr {
	float: right;
}
/*清除浮动*/
.clear:after {
	content: "";
	display: block;
	clear: both;
}
.notice{
	width: 420px;
	position: fixed;
	top: 50%;
	right: 30px;
	z-index: 999;
	background: #FFFFFF;
	padding: 6px;
	box-shadow: 0px 0px 10px 2px #3c3b3b;
}
.notice>img{
	width: 100%;
}
.notice>i{
	width: 26px;
	height: 26px;
	line-height: 26px;
	font-size: 22px;
	text-align: center;
	display: block;
	position: absolute;
	top: -13px;
	right: -13px;
	background: #FFFFFF;
	border-radius: 50%;
	cursor: pointer;
}
@media screen and (min-width: 1024px) {
	body {
	    padding-top: 76px !important;
	}
	.center {
		width: 1200px;
		margin: 0 auto;
		position: relative;
	}
	/*头部*/
	.head{
		width: 100%;
		height: 76px;
	    position: fixed;
	    top: 0;
	    left: 0;
	    z-index: 999;
	    background: #fff;
	    box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
	}
	.head>div.center{
		display: flex;
	    justify-content: space-between;
	}
	.head .nav{
		display: flex;
	    margin-right: 20px;
	}
	.head .nav>li{
		height: 76px;
		line-height: 76px;
		padding: 0 15px;
		cursor: pointer;
		position: relative;
	}
	.head .nav>li:before{
	    content: "";
	    width: 0;
	    height: 5px;
	    position: absolute;
	    bottom: 5px;
	    left: 50%;
	    transform: translatex(-50%);
	    transition: width .5s;
	}
	.head .nav>li:hover:before{
	    width: 100%;
	}
	.head .nav>li:hover .subnav{
		transform: rotate3d(0,0,0,0deg);
	}
	.head .nav>li:hover>a{
		color: #216ec6 !important;
	}
	.head .nav>li>a{
		display: block;
		color: #5d5d5d;
		font-size: 14px;
	}
	.nav_list{
		display: none !important;
	}
	.subnav{
	    position: fixed;
	    top: 76px;
	    left: 0;
	    width: 100%;
	    background: #fff;
	    opacity: 1;
	    box-shadow:10px 20px 20px rgba(0,0,0,0.18);
	    z-index: 5;
	    display: flex;
	    justify-content: center;
	    transform: rotate3d(1,0,0,-90deg);
	    transform-origin: 100% 0%;
	    transition: all 0.3s;
	}
	.subnav a {
	    width: 150px;
	    text-align: center;
	    display: block;
	    float: left;
	    color: #333;
	    font-size: 14px;
	    padding: 15px 0;
	}
	.subnav a i {
	    display: block;
	    width: 100%;
	    font-size: 36px;
	    height: 45px;
	    line-height: 45px;
	}
	.subnav a span{
	    display: block;
	    height: 30px;
	    line-height: 30px;
	}
	.subnav a:hover{
		background: #216ec6;
	}
	.subnav a:hover>*{
		color: #fff;
	}
	/*头部banner*/
	.headBanner{
	    width: 100%;
	    position: relative;
	}
	.bannerImg{
		width: 100%;
	}
	.bannerImg>img{
		width: 100%;
	}
	.headTitle{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		z-index: 98;
	}
	.headTitle>h1{
	    font-size: 42px;
	    color: #FFFFFF;
	    text-align: center;
	    font-weight: 100;
	}
	.headTitle>p{
	    text-align: center;
	    font-size: 18px;
	    color: #FFFFFF;
	    margin-top: 12px;
	    letter-spacing:1.5px;
	}
	.headTitleLeft{
		position: absolute;
	    top: 50%;
	    left: 30%;
	    transform: translate(-50%,-50%);
	    z-index: 98;
	}
	.headTitleLeft>h1{
		font-size: 44px;
		font-weight: 100;
		color: #FFFFFF;
		margin-bottom: 42px;
	}
	.headTitleLeft>span{
		display: block;
		color: #FFFFFF;
		font-size: 18px;
		line-height: 36px;
	}
	/*footer*/
	.foot .contact>div.center{
		display: flex;
		justify-content: space-between;
		padding-bottom: 38px;
	}
	.contact {
		background: #3f4d95;
		padding-top: 38px;
	}
	.home_about {
	    width: 250px;
	    line-height: 25px;
	}
	.home_about dt {
	    margin-bottom: 24px;
	    font-size: 18px;
	    color: #fff;
	    font-weight: normal;
	}
	.home_about dd {
	    color: #eeeeee;
	    line-height: 28px;
	    font-family: "宋体";
	}
	.aboutIntroduce{
		text-align: justify;
	}
	.home_about .more {
	    color: #fff;
	    display: inline-block;
	    border: 1px solid #cccccc;
	    line-height: 38px;
	    padding: 0 24px;
	    margin-top: 12px;
	}
	.home_service {
	    width: 250px;
	    padding: 0 50px;
	    line-height: 25px;
	}
	.contact h2 {
	    margin-bottom: 28px;
	    font-size: 18px;
	    color: #fff;
	    font-weight: normal;
	}
	.home_service a.sub {
	    font-size: 12px;
	    color: #fff;
	    line-height: 38px;
	    width: 150px;
	    display: inline-block;
	    border: 1px solid #cccccc;
	    text-align: center;
	    margin-right: 12px;
	    margin-bottom: 12px;
	    margin-top: 3px;
	}
	.home_product{
	    padding: 0 25px;
	    line-height: 25px;
	}
	.home_product a.sub {
	    font-size: 12px;
	    color: #fff;
	    width: 150px;
	    display: block;
	    height: 38px;
	}
	.home_contact {
	    width: 300px;
	    line-height: 25px;
	}
	.home_contact li {
	    color: #fff;
	    margin-bottom: 14px;
	    font-size: 12px;
	    display: flex;
	}
	.home_contact>img{
		width: 80px;
		margin-bottom: 16px;
	}
	.home_contact li i{
		display: block;
		width: 30px;
		height: 25px;
		text-align: center;
		line-height: 25px;
		font-size:16px ;
	}
	.copyright {
	    text-align: center;
	    line-height: 28px;
	    color: #ffffff;
	    padding: 15px 0;
	    border-top: 1px solid #fff;
	}
	.copyright>a{
		color: #ffffff;
		padding-left:5px ;
	}
	/*侧边栏*/
	.sidebar{
		position: fixed;
		top: 50%;
		right: 0px;
		z-index: 999;
	}
	.sidebar>li{
		width: 60px;
		height: 60px;
		background: rgba(53,63,88,0.66);
		border-bottom: 1px solid #FFFFFF;
		position: relative;
		cursor: pointer;
	}
	.sidebar>li:last-child{
		border-bottom: none;
	}
	.sidebar>li:hover .sidebar_btn{
	    right: 0;
	    background: #000;
	}
	.sidebar_btn{
		width: 140px;
		height: 60px;
		position: absolute;
		top: 0;
		right: -80px;
		transition: all .3s ease;
		overflow: hidden;
	}
	.sidebar_btn>i{
		display: block;
		width: 60px;
		height: 60px;
		line-height: 60px;
		font-size: 36px;
		color: #fff;
		text-align: center;
		cursor: pointer;
		float: left;
	}
	.sidebar_btn>p{
		width: 80px;
		height: 60px;
		line-height:60px;
		font-size: 16px;
		color: #FFFFFF;
		text-align: center;
		float: left;
		transition: all .3s;
	}
	.return{
		display: none;
	}
	.elasticLayer{
		position: absolute;
		right: 160px;
		top: 0;
		width: 120px;
		height: 120px;
		background: #fff;
		padding: 6px;
		display: none;
	    box-shadow: 0px 0.5px 2px 2px rgba(218, 218, 218, 0.5);
	}
	.elasticLayer:after{
		content: "";
		display: block;
		width: 0;
		height: 0;
		border-style: solid;
	    border-width: 10.61px;
	    border-color: #fff #fff transparent transparent;
	    position: absolute;
	    right: -10px;
	    top: 15px;
	    transform: rotate(45deg);
	 	box-shadow: 2px -2px 2px rgba(218, 218, 218, 0.5);
	}
	.sidebar>li:nth-child(1):hover .elasticLayer{
		display: none;
	}
	.sidebar>li:hover .elasticLayer{
		display: block;
	}
	.elasticLayer>img{
		width: 100%;
	}
	.phone{
	    width: 211px;
	    height: 50px;
	    font-size: 14px;
	    color: #596580;
	    top: 50%;
	    transform: translateY(-50%);
	    padding: 6px 11px;
	}
	.phone>p{
		line-height: 38px;
	}
	.servicePhone{
		display: flex;
		justify-content: center;
		height: 76px;
    	line-height: 76px;
	}
	.servicePhone1{
		display: block;
	    color: #5d5d5d;
    	font-size: 14px;
	}
	.servicePhone2{
		display: block;
	    color: #216ec6;
    	font-size: 20px;
    	line-height: 72px;
	}
}
@media screen and (max-width: 1024px) {
	body {
	    padding-top: 0.7rem !important;
	}
	.center{
		width: 100% !important;
	}
	/*头部*/
	.head{
		width: 100%;
		height: 0.7rem;
	    position: fixed;
	    top: 0;
	    left: 0;
	    z-index: 999;
	    background: #fff;
	    box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
	}
	.head>div.center{
		display: flex;
	    justify-content: space-between;
	}
	.logo{
		padding: 0.1rem 0 0.1rem 0.1rem;
	}
	.logo>img{
		height: 0.5rem;
	}
	.nav_icon{
		width: 0.7rem;
		height: 0.7rem;
		position: relative;
	}
	.navbtn{
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    display: block;
	    width: 0.28rem;
	    height: 0.02rem;
	    transition: all .3s ease-out 0s;
	    background: #555;
	    transform: translate(-50%,-50%);
	}
	.navbtn::before{
		position: absolute;
	    top: 0.1rem;
	    left: 0;
	    display: block;
	    width: 0.28rem;
	    height: 0.02rem;
	    content: '';
	    transition: all .3s ease-out 0s;
	    background: #555;
	}
	.navbtn:after{
	    position: absolute;
	    top: -0.1rem;
	    left: 0;
	    display: block;
     	width: 0.28rem;
	    height: 0.02rem;
	    content: '';
	    transition: all .3s ease-out 0s;
	    background: #555;
	}
	.head .active>span{
		background: transparent;
	}
	.head .active>span:after{
		top: 0rem;
	    transform: rotate(45deg);
	}
	.head .active>span:before{
		top: 0rem;
	    transform: rotate(-45deg);
	}
	/*头部导航*/
	.head .nav{
		display: none;
	}
	.maskNav{
	    width: 100%;
	    height: calc(100% - 0.7rem);
		position: fixed;
	    left: 0;
	    top: 0.7rem;
	    background: rgba(0, 0, 0, .5);
	    display: none;
        overflow: scroll;
	}
	.nav_list{
    	box-shadow: 0 7px 6px rgba(0, 0, 0, 0.3);
	    background: #fff;
	}
	.nav_list li{
		line-height: 0.6rem;
		color: #333333;
		font-size:0.14rem;
		border-bottom: 0.01rem solid #DDDDDD;
		position: relative;
	}
	.nav_list li a{
		display: block;
    	padding: 0 0.16rem;
		-webkit-tap-highlight-color: transparent;
	}
	.nav_list li a>i{
		margin-right: 0.1rem;
		font-size: 0.16rem;
	}
	.nav_list li>i{
		display: block;
		position: absolute;
		top: 0;
		right: 0.2rem;
		transform: rotate(0deg);
		transition: 0.3s all;
	}
	.subnav{
		display: none;
	}
	.subnav a:first-child{
		border-top:0.01rem solid #DDDDDD ;
	}
	/*头部banner*/
	.headBanner{
	    width: 100%;
	    position: relative;
	}
	.bannerImg{
		width: 100%;
	}
	.bannerImg>img{
		width: 100%;
	}
	.headTitle{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		z-index: 98;
	}
	.headTitle>h1{
	    font-size: 0.22rem;
	    color: #FFFFFF;
	    text-align: center;
	    font-weight: 100;
	}
	.headTitle>p{
	    text-align: center;
	    font-size: 0.14rem;
	    color: #FFFFFF;
	    letter-spacing:1.5px;
	}
	.headTitleLeft{
		width: 100%;
		padding-left: 0.28rem;
		position: absolute;
	    top: 50%;
	    left: 0;
	    transform: translate( 0,-50%);
	    z-index: 98;
	}
	.headTitleLeft>h1{
		font-size: 0.18rem;
		font-weight: 100;
		color: #FFFFFF;
		margin-bottom: 0.12rem;
	}
	.headTitleLeft>span{
		display: block;
		color: #FFFFFF;
		font-size: 0.12rem;
		line-height: 0.18rem;
	}
	/*侧边导航*/
	/*.sidebar{
		display: none;
	}*/
	.sidebar{
		position: fixed;
		bottom: 0.2rem;
		right: 0;
		z-index: 999;
	}
	.sidebar>li{
		width: 60px;
		height: 60px;
		background: rgba(53,63,88,0.66);
		border-bottom: 1px solid #FFFFFF;
		position: relative;
		cursor: pointer;
	}
	.sidebar>li:nth-child(2){
		display: none !important;
	}
	.sidebar>li:nth-child(3){
		display: none !important;
	}
	.sidebar_btn{
		width: 100%;
		height: 100%;
		overflow: hidden;
	}
	.sidebar_btn>i{
		display: block;
		width: 0.6rem;
		height: 0.6rem;
		line-height: 0.6rem;
		font-size: 0.36rem;
		color: #fff;
		text-align: center;
		cursor: pointer;
	}
	.sidebar>li .elasticLayer{
		display: none;
	}
	/*footer*/
	.foot .contact>div.center{
		display: none;
	}
	.contact {
   	 	background: #3f4d95;
	}
	.copyright {
		width: 100%;
	    text-align: center;
	    line-height: 0.2rem;
	    color: #ffffff;
	    padding: 0.15rem 0.16rem;
	}
	.copyright>a{
		color: #ffffff;
		padding-left:5px;
	}
	.servicePhone{
		display: none;
	}
	.notice{
		width: 60%;
		position: fixed;
		top: 50%;
		right: 30px;
		z-index: 999;
		background: #FFFFFF;
		padding: 6px;
		box-shadow: 0px 0px 10px 2px #3c3b3b;
	}
	.notice>img{
		width: 100%;
	}
	.notice>i{
		width: 26px;
		height: 26px;
		line-height: 26px;
		font-size: 22px;
		text-align: center;
		display: block;
		position: absolute;
		top: -13px;
		right: -13px;
		background: #FFFFFF;
		border-radius: 50%;
		cursor: pointer;
	}
}